<template>
    <section class="three">
            <h2 class="threetitle">{{$t('home2[0]')}}</h2>
            <h3 class="threeh3">{{$t('home2[1]')}}</h3>
            <section class="threemain">
                <div class="threeheader">
                    <p class="name">{{$t('zichan[1]')}}</p>
                    <p class="price">{{$t('zichan[2]')}}</p>
                    <p class="changeRate">24h</p>
                    <p class="high">{{$t('home2[2]')}}</p>
                    <p class="low">{{$t('home2[3]')}}</p>
                    <p class="volume">{{$t('jiaoyi2[7]')}}</p>
                    <p class="operation">{{$t('order[16]')}}</p>
                </div>
                <ul class="threelist" v-for="(item, index) in Prodata" :key="index" @click="ulclick(item)">
                    <li class="name">
                        <img :src="item.image" alt="">
                        <p>{{item.name}}</p>
                    </li>
                    <li class="price" style="display:flex" :class="{'rise':item.change < 0 , 'fall': item.change > 0}">
                        {{item.price}}≈ <p style="font-size: 10px;color: #333">{{item.cnyPrice}} CNY</p>
                    </li>
                    <li class="changeRate">
                        <span :class="{'rise':item.change < 0 , 'fall': item.change > 0}">{{item.changeRate}}</span>
                    </li>
                    <li class="high">
                        <span>{{item.high}}</span>
                    </li>
                    <li class="low">
                        <span>{{item.low}}</span>
                    </li>
                    <li class="volume">
                        <span>{{item.volume}}</span>
                    </li>
                    <li class="operation">
                        <img :src="require('_img/home/JIAOYI-ICON@2x.png')" alt="">
                    </li>
                </ul>
            </section>
        </section>
</template>

<script>
// import PagesSize from "_dom/paging"
export default {
    name: "domthree",
    props:['Prodata'],
    data() {
        return {
            
        };
    },
    methods: {
        ulclick(row){
            console.log(row)
            this.$router.push({path: "/contract", query: {code: row.code}})
        }
    },
    components: {},
};
</script>

